$directions: (
    "t": "top",
    "b": "bottom",
    "l": "left",
    "r": "right",
);

$dimensions: (
    "p": "padding",
    "m": "margin",
);

@each $dim in $dimensions {
    @each $dir in $directions {
        @for $i from 1 through 30 {
            $size: $i;
            .#{nth($dim,1)}#{nth($dir,1)}#{$size} {
                #{nth($dim,2)}-#{nth($dir,2)}: #{$size}px;
            }
        }
    }
}

@each $dim in $dimensions {
    @for $i from 1 through 6 {
        $size: $i * 5;
        .#{nth($dim,1)}#{$size} {
            #{nth($dim,2)}: #{$size}px;
        }
    }
}

@for $i from 10 through 20 {
    $size: $i * 2;
    .f#{$size} {
        color: #acb5c1;

        font-size: #{$size}px;
        font-weight: 500;
    }
}

/* 外边距、内边距全局样式 */
@for $i from 0 through 40 {
    .mt#{$i} {
        margin-top: #{$i}px !important;
    }
    .mr#{$i} {
        margin-right: #{$i}px !important;
    }
    .mb#{$i} {
        margin-bottom: #{$i}px !important;
    }
    .ml#{$i} {
        margin-left: #{$i}px !important;
    }
    .pt#{$i} {
        padding-top: #{$i}px !important;
    }
    .pr#{$i} {
        padding-right: #{$i}px !important;
    }
    .pb#{$i} {
        padding-bottom: #{$i}px !important;
    }
    .pl#{$i} {
        padding-left: #{$i}px !important;
    }
}
